<template>
	<div class="topTabbar">
		<div class="main">
			<span>{{title}}</span>
		</div>

		<div class="time">
			{{date}} {{week}}
		</div>
	</div>
</template>

<script>
	export default {
		inject: ['reload'],
		name: "topTabbar",
		data() {
			return {
				timer: null, //天气定时器
				date:'',
				week:'',
			}
		},
		props: {
			path: String,
			title: {
				type: String,
				default: "页面标题"
			}
		},
		mounted() {
			this.getTime();
			this.timer = setInterval(() => {
			    this.getTime();
			},60000);
		},
		beforeDestroy() {
		    if(this.timer) { //如果定时器还在运行 或者直接关闭，不用判断
		        clearInterval(this.timer); //关闭
		    }
		},
		methods: {
			getTime() {
				var that = this;
				//获取时间
				var date = new Date();
				var year = date.getFullYear();
				var month = date.getMonth() + 1;
				var day = date.getDate();
				if (month < 10) {
				    month = "0" + month
				};
				if (day < 10) {
				    day = "0" + day
				};
				var nowDate = year + "-" + month + "-" + day;
				
				// var h = date.getHours(); //获取小时
				// var m = date.getMinutes(); //获取分钟
				// var s = date.getSeconds(); //获取秒
				// if (h < 10) {
				//     h = "0" + h;
				// };
				// if (m < 10) {
				//     m = "0" + m;
				// };
				// if (s < 10) {
				//     s = "0" + s;
				// };
				// var nowTime = h + ":" + m + ":" + s;
				that.date = nowDate;
				// that.time = nowTime;
				
				var days = date.getDay();
				switch (days) {
				    case 1:
				        days = '星期一';
				        break;
				    case 2:
				        days = '星期二';
				        break;
				    case 3:
				        days = '星期三';
				        break;
				    case 4:
				        days = '星期四';
				        break;
				    case 5:
				        days = '星期五';
				        break;
				    case 6:
				        days = '星期六';
				        break;
				    case 0:
				        days = '星期日';
				        break;
				}
				that.week = days;//这是周几
				
			}
		}
	}
</script>

<style>
	.topTabbar {
		width: 1920px;
		height: 160px;
		position: relative;
		line-height: 160px;
		color: var(--color-high-text);
		padding-top: 20px;
		margin: 0 auto;
	}

	.main {
		width: 1920px;
		text-align: center;
		background: url("../../../assets/img/home/topTbabbar_bg.png") no-repeat center center;
		background-size: 1298px 95px;
		font-size: 43px;
		margin: 0 auto;
	}

	.main span {
		position: relative;
		top: -29px;
	}

	/*时间*/
	.time {
		white-space: nowrap;
		margin: auto 0;
		text-align: center;
		font-size: 20px;
		position: absolute;
		right: 65px;
		top: -8px;
	}
</style>
